<template>
  <div class="conditionItem">
    <el-select v-model="condition.appid" @change="handleSelectWx" @clear="clearSelectWx" clearable>
      <el-option v-for="item,n in wechatList.list" :label="item.nickName" :value="item.appid" :key="item.appid.toString()"></el-option>
    </el-select>
    <el-select v-model="condition.tagId" :loading="isLoad" placeholder="请选择标签">
      <el-option v-if="tagList.length" :value="-1" label="全部粉丝"></el-option>
      <el-option v-for="item,n in tagList" :value="item.id" :label="item.name" :key="n.toString()"></el-option>
    </el-select>
  </div>
</template>
<script>
  import {mapState, mapActions} from 'vuex'
  export default {
    props: ['condition'],
    data () {
      return {
        tagList: [],
        isLoad: false
      }
    },
    computed: {
      ...mapState({
        wechatList: state => state.wechatManage.wechatList,
        tags: state => state.wxfansList.tagsList
      })
    },
    methods: {
      ...mapActions(['getwxTagList']),
      async handleSelectWx (val) {
        if (val) {
          this.condition.tagId = -1
        }
        if (val) {
          this.isLoad = true
          await this.getwxTagList(val)
          this.tagList = this.tags
          this.isLoad = false
        }
      },
      clearSelectWx () {
        this.condition.appid = ''
        this.tagList = []
      }
    }
  }
</script>
